<template>
  <div id="web_admin" :class="pageWithSidebar">
    <AdminSidebar/>
<!--    <HeaderReminder/>-->
    <router-view/>
  </div>
</template>

<script>
import { mapState } from 'vuex';
import $store from '@/store';
import HeaderReminder from '@/components/announcement/HeaderReminder';
import AdminSidebar from './AdminSidebar';

export default {
  name: 'WebAdmin', // 管理员页面
  components: { HeaderReminder, AdminSidebar },
  computed: {
    ...mapState(['currentSpace', 'sidebarCollapsed', 'invisibleSidebar']),
    // 有侧边栏的页面调用这个方法生成样式
    pageWithSidebar() {
      let className = 'page-with-sidebar';
      if (window.innerWidth < 1200 || this.sidebarCollapsed) className += ' sidebar-collapsed';
      if (window.innerWidth < 768 || this.invisibleSidebar) className += ' invisible-sidebar';
      return className;
    },
  },
  beforeRouteEnter(to, from, next) {
    const state = $store.state;
    if (!state.currentUser.admin) {
      next((vm) => {
        vm.$message.error('权限不足');
        vm.goBack();
      });
    } else next();
  },
};
</script>

<style></style>
